<template>
	<view>
		<Adminheader></Adminheader>
		<Adminheaders></Adminheaders>
		<view class="box box-quotes">
			<view class="boxs">
				<view class="box-hd cl">
					<h2 class="title fl">工作管理</h2> 
					<!-- <a class="all fr">全部工作 (1)<i class="icon iconfont">&#xe605;</i></a> -->
					<view style="clear: both;"></view>
				</view>
				<view class="box-bd">
					<view class="data-empty" v-if="fl == false">
						<img src="/static/images/management.png"> 
						<p>您还没有进行中的工作</p>
					</view>
					<view class="item" v-for="(item,index) in getWorkManagement" :key="index" @tap="details(item.id)">
						<view class="info">
							<p class="title">
								<a>{{item.name}}</a>
								<view class="other cl"><span class="t-gray">{{item.publisher}}</span></view>
							</p> 
						</view>
						
						<view class="joBtimeBox_jobBox">
							<view class="joBtimeBox jobBox" >
								<view class="joBtime isJob" v-for="(items,index) in item.work_date" :key="index">
									<el-popover placement="top-end" width="300" trigger="click">
										<span class="tips-content">{{items}}签到</span>
										<span slot="reference">1</span>
									 </el-popover>
								</view>
							</view>
							<view class="joBtimeBox signIn" >
								<view class="joBtime" v-for="(items,index) in joBtime" :key="index">
									<el-popover placement="top-end" width="300" trigger="click">
										<span class="tips-content">未签到</span>
										<span slot="reference" style="color: #EFEEEF">1</span>
									 </el-popover>
								</view>
							</view>
						</view>
			
					
					</view>
				</view>
			</view>
		</view>
		<Jobfooter></Jobfooter>
	</view>
</template>

<script>
	import Adminheader from '../admin_header/admin_header.vue'
	import Adminheaders from '../admin_header/admin_headers.vue'
	import Jobfooter from '../../pages/job_detail/jobfooter/jobfooter.vue'
	export default {
		data() {
			return {
				
				listJob:[],
				joBtime:[1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18,19,20,21,22,23,24,25,26,27,28,29,30],
				getWorkManagement:[],
				fl:false,
			}
		},
		mounted() {
		
		},
		methods: {
		
			details(id){//跳转详情页
					// wx.navigateTo({url: '/admin/admin_log/admin_log?apply_id='+id}) 
			}
		},
		created() {
			this.$http.post('/Work/getWorkManagement',{
				user_id:this.$store.state.userInfo.user_id,
				page:1,
				limit:10,
			}).then(res => {
				if(res.data.data.row.length==0){
					this.fl = false
				}else{
					this.fl = true
				}
				this.getWorkManagement = res.data.data.row
				
				
			})	
		},
		components:{
			Adminheader,
			Jobfooter,
			Adminheaders
		}
	}
</script>

<style lang="scss" scoped>
.box {
    padding: 20px 0px;
	padding-top: 80px;
	line-height: 24px;
	background: #f6f8f9;
	.boxs{
		background: #FFFFFF;
		.box-hd{
			.title{
				font-size: 18px;
				padding: 25px 15px;
			}
			.all {
			    height: 24px;
			    margin-top: 4px;
			    line-height: 66px;
				color: #008bf7;
				margin-right: 10px;
				.icon {
				    margin-left: 5px;
					font-size: 20px;
					vertical-align: middle;
				}
			}
			.fl {
			    float: left;
			}
			.fr {
			    float: right;
			}
		}
		.box-bd {
		    margin-top: 10px;	
			.data-empty {
			    padding: 100px 0;
			    text-align: center;
				img {
				    width: 120px;
				}
				p {
				    margin-top: 10px;
				}
			}
			.item {
			    display: block;
			    width: 100%;
			    min-height: unset;
			    padding-top: 20px;
				border-top: 1px solid #edf1f4;
				text-align: center;
				.other {
				    margin-top: 5px;
					.t-gray {
					    color: #9ca6ae;
					}
					.fl {
					    float: left;
					}
				}
				.info {
				    width: 100%;
					margin-bottom: 20px;
					.title {
					    max-height: 48px;
						a {
						    color: #092235;
						}
					}

				}
				.meta {
				    display: block;
				    width: 100%;
				    margin-top: 20px;
					clear: both;

					.btn-group {
					    // display: -ms-flexbox;
					    // display: flex;
					    // -ms-flex-pack: justify;
					    // justify-content: space-between;
					    width: 100%;
					    margin-top: 20px;
						text-align: center;
						.btn-text {
						    display: inline-block;
						    text-align: center;
						    color: #008bf7;
						    cursor: pointer;
							line-height: 24px;
						}
						.btn-im {
						    height: 24px;
						    padding-left: 26px;
						    background: url(/static/images/im-icon.gif) no-repeat 0 0;
						    background-size: 24px 24px;
						}
					}
				}
			}
		}
	}
	
}
 .is-selected {
    color: #1989FA;
  }
    .calendar-day{
          text-align: center;
          color: #202535;
          line-height: 30px;
          font-size: 12px;
      }
      .is-selected{
          color: #F8A535;
          font-size: 10px;
          margin-top: 5px;
      }
  
	/deep/  .el-calendar-day{
		  height: 27px!important;
		  padding:0;
	  }
	/deep/ .el-calendar__body {
		padding: 0px 20px;
	} 
	.joBtimeBox{
		width: 230px;
		margin:0 auto;
		.joBtime{
			width: 20PX;
			height: 20PX;
			background-color: #EFEEEF;
			display:inline-block;
			margin-right: 3px;
		}
		.isJob{
			background-color: #008BF7;
			color: #008BF7;
		}
	}
.jobBox{
	position: absolute;
	left: 73px;
	text-align: left;
	width: auto!important;
}
.joBtimeBox_jobBox{
	width: 230px;
	margin: 0 auto;
}
.signIn{
	padding-bottom:20px;
}
</style>
